<template>
  <div class="priceFooter">
    <span class="total">
      总价:￥{{totalPrice}}
    </span>
  </div>
</template>

<script>
import { mapState, mapGetters } from 'vuex'
export default {
  computed: {
    ...mapState(['totalPrice']),
    ...mapGetters(['totalPrice'])
  }
}
</script>
<style lang="less" scoped>
.priceFooter {
  position: fixed;
  bottom: 0;
  height: 50px;
  border-top: 1px solid #f5f5f5;
  border-bottom: 1px solid #f5f5f5;
  width: 100%;
  box-shadow: 1px 1px 20px rgba(0, 0, 0, 0.2);
  line-height: 50px;
  background-color: #fff;
  .total {
    color: red;
    font-size: 18px;
    float: right;
    margin-right: 8px;
  }
}
</style>
